<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/WEB-INF/jsp/commons/taglibs.jsp" %>
<!DOCTYPE HTML>
<html ng-app>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <META HTTP-EQUIV="pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
    <META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
    <title>${title}</title>
    <%@ include file="/WEB-INF/jsp/commons/meta.jsp" %>
    <link href="${ctx}/resources/new/style.css" type="text/css" rel="stylesheet"/>

</head>
<body>
<!-- 分页显示演示开始 -->
<style>
    <!--
    .tab {
        margin-bottom: 0px;
        margin-top: 6px;
    }

    .tab > li > a {
        line-height: 22px;
        padding-bottom: 2px;
        padding-top: 2px;
    }

    .tab-content {
        border: 1px solid #E3E3E3;
        border-radius: 0px 0px 4px 4px;
        border-top: none;
        padding: 2px;
    }

    .table [valign="top"] {
        vertical-align: top;
    }

    #single div[id^=m] {
        background-color: #FFFFFF;
        border: 1px solid #E3E3E3;
        border-radius: 4px;
        margin: 2px;
        padding: 2px;
        line-height: 25px;
        float: left;
        width: 45%;
        min-height: 225px;
    }

    #mNoGoods {
        max-height: 225px;
        display: block;
        overflow-y: auto;
    }

    #single div[id^=m] span {
        float: left;
    }

    .title {
        width: 60px;
        margin-left: 20px;
    }

    #mGoods {
        min-width: 470px;
    }

    #memo {
        width: 99%;
    }

    -->
</style>
<ul class="nav nav-tabs tab tBlock">
    <li class="active">
        <a deny="not" class="nFocus" href="#single" data-toggle="tab">
            <i class="icon-tags"></i>
            商品入库
        </a>
    </li>
</ul>
<div class="tab-content">
    <div class="tab-pane active" id="single">
        <form id="inputForm" class="well form-inline" action="${ctx}/adoms/goods/inStock" method="post">
            <table class="table table-striped table-bordered table-condensed">
                <tr>
                    <td class="span2">商品二维码:</td>
                    <td>
                        <input type="text" name="goodsQr" id="goodsQr" class="tWidth90">
                        <input type="hidden" name="qrCode.id" id="qrCode">
                    </td>
                </tr>
                <tr>
                    <td class="span2">请选择商品:</td>
                    <td>
                        <select id="marchandise" name="marchandise.id">
                            <c:forEach items="${mList }" var="m" varStatus="index">
                                <option value="${m.id }">${index.index + 1}.${m.name }</option>
                            </c:forEach>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td class="span2" valign="top">商品详情:</td>
                    <td>
                        <c:forEach items="${mList }" var="m">
                            <div class="hide" id="m${m.id }">
                                <span class="title">商品名称：</span>
                                <span class="span3">${m.name }</span>
                                <br/>
                                <span class="title">商品编号：</span>
                                <span class="span3">${m.code }</span>
                                <br/>
                                <span class="title">单价：</span>
                                <span class="span3 tBlue">￥${m.price } 元</span>
                                <br/>
                                <span class="title">商品条码：</span>
                                <span class="span3">${m.barCode }</span>
                                <br/>
                                <span class="title">品牌：</span>
                                <span class="span3">${m.brand.name }</span>
                                <br/>
                                <span class="title">产地：</span>
                                <span class="span3">${m.producePlace }</span>
                                <br/>
                                <span class="title">生产日期：</span>
                                <span class="span3">${m.produceDate }</span>
                                <br/>
                                <span class="title">保质期：</span>
                                <span class="span3">${m.shelflife }</span>
                                <br/>
                                <span class="title">商品描述：</span>
                                <span class="span3">${m.description }</span>
                                <br/>
                            </div>
                        </c:forEach>
                        <div class="hide" id="mGoods">
                            <span class="title">内部编号：</span>
                            <span class="span3" id="innerNum"></span>
                            <br/>
                            <span class="title">创建日期：</span>
                            <span class="span3" id="insertTime"></span>
                            <br/>
                            <span class="title">二维码：</span>
							<span style="text-align: center;">
								<span id="gwCode" class="tBlue"></span>
								<br/>
								<img width="145" id="goodsUri" src="">
							</span>
                            <span class="title">积分码：</span>
							<span style="text-align: center;">
								<span id="iiCode" class="tBlue"></span>
								<br/>
								<img width="120" id="integralUri" src="">
							</span>
                        </div>
                        <div class="hide" id="mNoGoods">
                            <span style="color: red;">暂无该二维码相关信息。。</span>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>所属部门:</td>
                    <td>
                        <select id="department" name="department.id">
                            <option value="${USER.department.id}">${USER.department.name}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>状态:</td>
                    <td>
                        <input id="state" name="state" type="hidden" value="待售" size="30" maxlength="80"/>
                        <span class="tBlue">待售</span>
                    </td>
                </tr>
                <tr>
                    <td valign="top">备注:</td>
                    <td>
                        <textarea id="memo" name="memo" rows="4" class="span6"></textarea>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" align="center">
                        <input class="btn span2 btn-primary" disabled="disabled" type="button" id="inSubmit"
                               value="商品入库"/>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>
<script>
    $(function () {
        $("#inputForm").validate({
            rules: {
                "marchandise.id": "required",
                "department.id": "required",
                "goodsQr": "required",
                "qrCode.id": "required",
                memo: "required"
            }
        });
        $("#marchandise").change(function () {
            $("div[id^=m]:not([id^=mG])").hide();
            var mid = $(this).val();
            $("#m" + mid).show();
        }).change();
        $("#inSubmit").click(function () {
            $("#inputForm").submit();
        });
        //输入二维码后就立即查询货物二维码相关的信息
        $("#goodsQr").on("blur", function () {
            var goodsDiv = $(this);
            var goodsQr = $.trim(goodsDiv.val());
            var oldValue = $.trim(goodsDiv.attr("oldValue"));
            if (goodsQr && oldValue != goodsQr) {
                $.post("${ctx}/adoms/qrGoodsCode/getGoodsByGCode", {
                    qrCode: goodsQr
                }, function (data) {
                    goodsDiv.attr("oldValue", goodsQr);
                    if (data) {
                        $("#mGoods").show();
                        $("#qrCode").val(data.id);
                        $("#mNoGoods").hide();
                        $("#goodsUri").attr("src", "${ctx}/adoms/qrGoodsCode/qrImg?qr=" + data.qrCode);
                        $("#integralUri").attr("src", "${ctx}/adoms/qrGoodsCode/qrImg?qr=" + data.iCode);
                        $("#iiCode").html("i." + data.iCode);
                        $("#gwCode").html("g." + data.wCode);
                        $("#innerNum").text(data.innerNum);
                        var d = new Date();
                        d.setTime(data.insertTime);
                        $("#insertTime").text(d.toLocaleString());
                        $("#inSubmit").removeAttr("disabled");
                    } else {
                        $("#inSubmit").attr("disabled", "disabled");
                        $("#mGoods").hide();
                        $("#mNoGoods").show();
                        $("#qrCode").val("");
                    }
                }, "json");
            }
        });
    });
</script>
<c:if test="${msg != null}">
    <script>
        $(function () {
            msgAlert.show("${msg}");
        });
    </script>
</c:if></body>
</html>